<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@ include file="/common/include/page.jsp"%>
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<title>修改个人信息 - 用户中心</title>
<%@ include file="/common/include/title.jsp"%>

<%-- 表单验证 --%>
<link rel="stylesheet" href="${rootpath }/common/resource/bootstrapvalidator/css/bootstrapValidator.css"/>
<script type="text/javascript" src="${rootpath }/common/resource/bootstrapvalidator/js/bootstrapValidator.js"></script>

<!--引入CSS-->
<link rel="stylesheet" type="text/css" href="${rootpath }/common/resource/webuploader/webuploader.css">
<!--引入JS-->
<script type="text/javascript" src="${rootpath }/common/resource/webuploader/webuploader.js"></script>

<!-- My97DatePicker日期插件 -->
<script type="text/javascript" src="/mvchain-system/common/resource/My97DatePicker/WdatePicker.js"></script>
   
<script type="text/javascript">
	$(function (){
	    $('#form').bootstrapValidator({
	    	container: 'tooltip',
	        feedbackIcons: {
	            valid: 'glyphicon glyphicon-ok',
	            invalid: 'glyphicon glyphicon-remove',
	            validating: 'glyphicon glyphicon-refresh'
	        },
	        fields: {
	        	nickName: {
	                validators: {
	                	notEmpty:
                    	{
                   			message: '昵称不能为空'
                    	},
                        stringLength: {
                            min: 4,
                            max: 50,
                            message: '昵称长度必须在6到50位之间'
                        }
	                }
	            },
	            trueName: {
	                validators: {
	                	notEmpty:
                    	{
                   			message: '真实姓名不能为空'
                    	},
                        stringLength: {
                            min: 1,
                            max: 50,
                            message: '真实姓名长度必须在1到50位之间'
                        }
	                }
	            },
	            address: {
	                validators: {
	                	notEmpty:
                    	{
                   			message: '详细地址不能为空'
                    	},
                        stringLength: {
                        	min: 6,
                            max: 50,
                            message: '详细地址长度必须在6到18位之间'
                        }
	                }
	            }
	        }
	    });
	});
</script>

<script type="text/javascript">
	/**
		选择地区
	*/
	function selectRegion(currId,tarId,finiId)
	{
		var curr = $("#" + currId);
		var parentId = "0" ;  
		if(curr != 'undefined')
		{
			parentId = curr.val()
		}
		
		/* 如果取不到值 */
		if(parentId == '')
		{
			parentId = "0" ;
		}
		if(tarId == '')
		{
			return false ; 
		}
		
		if(finiId != '')
		{
			$("#" + finiId).val(parentId);
		}
		
		var tar = $("#" + tarId);
		/* ajax请求服务器,获取json数据 */
		$.post(
			"${rootpath}/outer/common/regionList.html",
			"json={'version':'1','data':{'parentId':'"+ parentId +"'}}",
			function (data)
			{
				var regionList = data.data.regionList ;
				//alert(regionList.length )
				
				/*
					拼装的目标HMTL
					<option value='-1'>请选择</option>
				*/
				var resSb = "<option value='-1'>请选择</option>" ; 
				for(var i = 0 ; i < regionList.length ; i ++ )
				{
					var region = regionList[i] ; 
					resSb += "<option value='"+ region.id +"'>"+ region.name +"</option>" ; 
				}
				
				//alert(resSb);
				tar.html(resSb);
			},
			'json'
		);
		return false ; 
	}
	
	/* 页面一加载就初始化 */
	$(function(){
		selectRegion('region1','region1','');
	})
</script>
</head>
<body>
	<%@ include file="/common/include/header.jsp"%>
	<div class="container-fluid">
		<div class="row">
			<div class="col-sm-8 col-sm-offset-1 main">
				<h2 class="sub-header">修改个人信息</h2>
				
				<form id="form" class="form-horizontal" action="${rootpath }/head/users/usersUpdateSubmit.html">
					<input type="hidden" name="operType" value="${param.operType }">
					<div class="form-group">
						<label for="email" class="col-sm-2 control-label">邮箱:</label>
						<div class="col-sm-8">
							${requestScope.users.email }
						</div>
					</div>
					<div class="form-group">
						<label for="email" class="col-sm-2 control-label">昵称:</label>
						<div class="col-sm-8">
							<input type="text" id="email" name="nickName" value="${requestScope.users.nickName }" class="form-control" placeholder="昵称">
						</div> 
					</div>
					<div class="form-group">
						<label for="email" class="col-sm-2 control-label">手机:</label>
						<div class="col-sm-8">
							<input type="text" id="phone" name="phone" value="${requestScope.users.phone }" class="form-control" placeholder="手机">
						</div> 
					</div>
					<div class="form-group">
						<label for="email" class="col-sm-2 control-label">真实姓名:</label>
						<div class="col-sm-8">
							<input type="text" id="trueName" name="trueName" value="${requestScope.users.trueName }" class="form-control" placeholder="真实姓名">
						</div> 
					</div>
					<div class="form-group">
						<label for="email" class="col-sm-2 control-label">qq:</label>
						<div class="col-sm-8">
							<input type="text" id="qq" name="qq" value="${requestScope.users.qq }" class="form-control" placeholder="qq">
						</div>
					</div>
					<div class="form-group">
						<label for="email" class="col-sm-2 control-label">生日:</label>
						<div class="col-sm-8">
							<input type="text" id="birthday" name="birthdayStr" value="<fmt:formatDate value="${requestScope.users.birthday }" pattern="yyyy-MM-dd"/>" 
							onclick="WdatePicker({dateFmt:'yyyy-MM-dd'})" readonly="readonly"
							class="form-control" placeholder="生日">
						</div>
					</div>
					<div class="form-group">
						<label for="email" class="col-sm-2 control-label">性别:</label>
						<div class="col-sm-8">
							<label class="radio-inline">
								<input type="radio" id="sex0" name="sex" value="0" ${requestScope.users.sex == '0' ? 'checked' : ''} placeholder="性别">
								保密
							</label>
							<label class="radio-inline">
								<input type="radio" id="sex1" name="sex" value="1" ${requestScope.users.sex == '1' ? 'checked' : '' } placeholder="性别">
								男
							</label>
							<label class="radio-inline">
								<input type="radio" id="sex2" name="sex" value="2" ${requestScope.users.sex == '2' ? 'checked' : '' } placeholder="性别">
								女
							</label>
						</div>
					</div>
					<div class="form-group">
						<label for="regionId" class="col-sm-2 control-label">地区:</label>
						<div class="col-sm-8">
							${requestScope.users.region.parentRegion.parentRegion.name } 
							${requestScope.users.region.parentRegion.name } 
							${requestScope.users.region.name }
							<input type="text" class="sr-only" name="regionId" id="regionId" value="${requestScope.users.regionId}">
							<span>
								选择:
								<select id="region1" onchange="return selectRegion('region1','region2','regionId');">
									<option value="">请选择</option>
								</select>
								<select id="region2" onchange="return selectRegion('region2','region3','regionId');">
								</select>
								<select id="region3" onchange="return selectRegion('region3','region4','regionId');">
								</select>
							</span>
						</div>
					</div>
					<div class="form-group">
						<label for="address" class="col-sm-2 control-label">详细地址:</label>
						<div class="col-sm-8">
							<textarea rows="5" cols="80" id="address" name="address" class="form-control">${requestScope.users.address }</textarea>
						</div>
					</div>
					<div class="form-group">
						<div class="col-sm-8 col-sm-offset-2">
							<button class="btn btn-lg btn-primary" type="submit">提交</button>
						</div>
					</div>
				</form>
			</div>
		</div>
	</div>
	<%@ include file="/common/include/footer.jsp"%>
</body>
</html>